<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>首页</title>
</head>
<body>
    <main>
        <div class="swiper-container banner">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <img src="./img/course-img02.png" alt="">
                </div>
                <div class="swiper-slide">
                    <img src="./img/course-img03.jpg" alt="">

                </div>
                <div class="swiper-slide">
                    <img src="./img/course-img04.jpg" alt="">
                </div>
                
            </div>
            <!-- 如果需要分页器 -->
            <div class="swiper-pagination"></div>
        </div>
        <!-- 运动健身 -->
        <div class="campaign">
            <!--  -->
            <div class="rank-punch">
                <div class="rank">
                    <p class="rank-p">今日排名</p>
                    <span id="rankNum" class="rankNum">10</span>
                </div>
                <div class="punch">
                    <div class="day" id="todayPunch">今日打卡</div>
                    <h3>累计打卡<span id="punchDay"></span>天 </h3>
                </div>
            </div>
            <!-- 运动 -->
            <div class="sports mt20">
                <div class="sports-date">
               <div>运动数据</div>
                </div>
                <div class="sports-bange" id="sportsBange">
                    <div>运动累计徽章</div>
                    <div class="three"><span id="badgeNum">--</span>枚</div>
                </div>
            </div>
            <!-- 课程训练 -->
            <div class="training mt20" id="training">
                <div>课程训练</div>
            </div>
            <!-- 户外跑步 -->
            <div class="run mt20" id="runClick">
                <div> 户外跑步</div>
            </div>
        </div>

    </main>
    <!-- 尾部 -->
    <div id="footer" class="footer"></div>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
</body>
</html>